import Taro from '@tarojs/taro-rn';
import * as tslib_1 from "tslib";
import React from 'react';
import { Component } from "@tarojs/taro-rn";
import { View, Image, Text, Swiper, SwiperItem } from "@tarojs/components-rn";
import { toJS } from 'mobx';
import { inject, observer } from "@tarojs/mobx-rn";
import { getRuntime, pageSize } from "../../utils/common";
import indexStyleSheet from "./index_styles";
import bg_05 from '../../assets/img/bg_05.png';
import bg_06 from '../../assets/img/bg_06.png';
import bg_07 from '../../assets/img/bg_07.png';
import bg_08 from '../../assets/img/bg_08.png';
import icon_37 from '../../assets/img/icon_37.png';
import icon_38 from '../../assets/img/icon_38.png';
import icon_39 from '../../assets/img/icon_39.png';
import icon_40 from '../../assets/img/icon_40.png';
var _styleSheet = indexStyleSheet;
let Business = class Business extends Component {
  constructor(props) {
    super(props);
    this.state = {
      items: [],
      pageIndex: 1,
      pageSize,
      count: {}
    };
  }
  componentWillMount() {
    Taro.setNavigationBarTitle({ title: '工商服务中心' });
    this.getAllCompanyTaxReturn();
    this.getCompanyTaxReturnCount();
  }
  getCompanyTaxReturnCount() {
    let { FinancialCenterStore } = this.props.stores;
    FinancialCenterStore.getCompanyTaxReturnCount({
      callback: res => {
        this.setState({
          count: toJS(res)
        });
      }
    });
  }
  handelRouter(url = '/pages/index/index') {
    if (!getRuntime().getToken()) {
      getRuntime().navigateTo('/pages/login/login');
      return;
    }
    getRuntime().navigateTo(url);
  }
  // 获取动态信息
  getAllCompanyTaxReturn() {
    let { FinancialCenterStore } = this.props.stores;
    let { pageIndex, pageSize } = this.state;
    FinancialCenterStore.getAllCompanyTaxReturn({
      pageIndex,
      pageSize: 20,
      callback: res => {
        // 数据四条数据一组，方便列表循环
        let resArr = res.items;
        let items = this.getGroupArray(resArr, 4);
        this.setState({
          items
        });
      }
    });
  }
  // 将一维数组分割成二位数组
  getGroupArray(arr, groupLength = 4) {
    if (arr.length === 0) return arr;
    let resArr = [];
    let temp = [];
    for (let i = 0; i < arr.length; i++) {
      temp.push(arr[i]);
      // 组长的整数倍时写入数组,并清空临时数组
      if ((i + 1) % groupLength === 0) {
        resArr.push(temp);
        temp = [];
      }
      // 写人最后几个不够一组的数据
      if (arr.length % groupLength !== 0 && i === arr.length - 1) {
        resArr.push(temp);
      }
    }
    return resArr;
  }
  render() {
    let { items, count } = this.state;
    return <View style={_styleSheet["business-center"]}>
       <View style={_styleSheet["business-theme"]}>
         <View onClick={this.handelRouter.bind(this, '/pages/business/page1')} style={_styleSheet["theme"]}>
           <Image src={bg_05} style={_styleSheet["theme-bg"]} />
           <View style={_styleSheet["content"]}>
             <Image src={icon_37} style={_styleSheet["theme-icon"]} />
             <View style={_styleSheet["theme-info"]}>
               <Text style={_styleSheet["title"]}>营业执照代注册</Text>
               <Text style={_styleSheet["num"]}>已成功办理 {count.yyzzdbCount} 个</Text>
             </View>
             <View style={[_styleSheet["btn-banli"], _styleSheet["btn1"]]}>立即办理></View>
           </View>
         </View>

         <View onClick={this.handelRouter.bind(this, '/pages/business/page2')} style={_styleSheet["theme"]}>
           <Image src={bg_06} style={_styleSheet["theme-bg"]} />
           <View style={_styleSheet["content"]}>
             <Image src={icon_38} style={_styleSheet["theme-icon"]} />
             <View style={_styleSheet["theme-info"]}>
               <Text style={_styleSheet["title"]}>公司报税、年检、注销</Text>
               <Text style={_styleSheet["num"]}>已成功办理 {count.gsbsnjzxCount} 个</Text>
             </View>
             <View style={[_styleSheet["btn-banli"], _styleSheet["btn2"]]}>立即办理></View>
           </View>
         </View>

         <View onClick={this.handelRouter.bind(this, '/pages/business/page3')} style={_styleSheet["theme"]}>
           <Image src={bg_07} style={_styleSheet["theme-bg"]} />
           <View style={_styleSheet["content"]}>
             <Image src={icon_39} style={_styleSheet["theme-icon"]} />
             <View style={_styleSheet["theme-info"]}>
               <Text style={_styleSheet["title"]}>建企资质服务中心</Text>
               <Text style={_styleSheet["num"]}>已成功办理 {count.jqzzfwzxCount} 个</Text>
             </View>
             <View style={[_styleSheet["btn-banli"], _styleSheet["btn3"]]}>立即办理></View>
           </View>
         </View>

         <View onClick={this.handelRouter.bind(this, '/pages/business/page4')} style={_styleSheet["theme"]}>
           <Image src={bg_08} style={_styleSheet["theme-bg"]} />
           <View style={_styleSheet["content"]}>
             <Image src={icon_40} style={_styleSheet["theme-icon"]} />
             <View style={_styleSheet["theme-info"]}>
               <Text style={_styleSheet["title"]}>其他服务</Text>
               <Text style={_styleSheet["num"]}>已成功办理 {count.othersCount} 个</Text>
             </View>
             <View style={[_styleSheet["btn-banli"], _styleSheet["btn4"]]}>立即办理></View>
           </View>
         </View>

       </View>
       {items.length > 0 && <View>
            <View style={_styleSheet["interval"]} />
            <View style={[_styleSheet["column-title"], _styleSheet["content-30"]]}>
               <Text style={_styleSheet["column-name"]}>最新动态</Text>
               
            </View>

            <View style={_styleSheet["list-05"]}>
              <Swiper vertical={true} style={_styleSheet["list-swiper"]}>
                {items.map(item => {
              return <SwiperItem>
                        {item.map(group => {
                  return <View key={group.id} style={_styleSheet["list-05-item"]}>
                                <View style={_styleSheet["title"]}>
                                  {group.companyName}
                                  <Text style={_styleSheet["name"]}>{group.typeName}</Text>
                                </View>
                                <View style={_styleSheet["time"]}>{group.creationTime}</View>
                              </View>;
                })}
                      </SwiperItem>;
            })}
              </Swiper>
            </View>
         </View>}
     </View>;
  }
};
Business = tslib_1.__decorate([inject("stores"), observer], Business);
export default Business;